/**
* v-drag拖动
* Copyright (c) 2021 ruoyi
*/

export default {
    // drag.js  
    bind(el, binding, vnode) {
        let offsetX = 0;
        let offsetY = 0;
        let dragging = false;

        function onMouseDown(event) {
            dragging = true;
            offsetX = event.clientX - el.getBoundingClientRect().left;
            offsetY = event.clientY - el.getBoundingClientRect().top;

            // 阻止默认行为，例如选择文本  
            event.preventDefault();

            // 添加全局事件监听器  
            document.addEventListener('mousemove', onMouseMove);
            document.addEventListener('mouseup', onMouseUp);
        }

        function onMouseMove(event) {
            if (dragging) {
                let rect = el.getBoundingClientRect();
                let x = event.clientX - offsetX;
                let y = event.clientY - offsetY;

                // 这里可以添加边界检查等逻辑  

                // 更新元素位置  
                el.style.left = `${x}px`;
                el.style.top = `${y}px`;

                // 触发一个自定义事件，以便父组件可以响应拖动（如果需要）  
                vnode.context.$emit('dragging', { x, y });
            }
        }

        function onMouseUp() {
            dragging = false;

            // 移除全局事件监听器  
            document.removeEventListener('mousemove', onMouseMove);
            document.removeEventListener('mouseup', onMouseUp);

            // 触发一个自定义事件，表示拖动结束（如果需要）  
            vnode.context.$emit('dragend');
        }

        // 绑定mousedown事件  
        el.addEventListener('mousedown', onMouseDown);

        // 如果需要，可以在unbind钩子中移除事件监听器  
        // 但在这个例子中，我们依赖于组件的销毁来自动清理  
    }
}
